<?php
use yii\helpers\ArrayHelper;

?>
<form class="layui-form" action="/user/edit">
    <div class="layui-form-item">
        <label class="layui-form-label">用户名</label>
        <div class="layui-input-inline">
            <input type="text" value="<?= $User->username ?>" lay-verify="required"
                   class="layui-input layui-input-disbaled" readonly disabled>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">手机号码</label>
        <div class="layui-input-inline">
            <input type="text" name="mobile" value="<?= $User->mobile ?>" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">邮箱</label>
        <div class="layui-input-inline">
            <input type="text" name="email" value="<?= $User->email ?>" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">头像</label>
        <div class="layui-input-inline">
            <div class="site-demo-upload">
                <img id="avatar_view"
                     src="<?php if (isset($User->avatar) && !empty($User->avatar)) echo HTTP_DOMAIN_ASSETS . '/' . $User->avatar; ?>">
                <input id="avatar" type="hidden" name="avatar" value="<?= ArrayHelper::getValue($User, 'avatar') ?>">
                <div class="site-demo-upbar">
                    <input type="file" name="Assets[image]" id="demo">
                </div>
            </div>
            <div class="layui-form-mid layui-word-aux">请上传50*50像素的正方形图片格式支持jpg|png，超出大小会被压缩</div>
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-input-block">
            <input type="hidden" name="<?= Yii::$app->request->csrfParam ?>"
                   value="<?= Yii::$app->request->csrfToken ?>">
            <button class="layui-btn" lay-submit lay-filter="submit-btn">保存</button>
        </div>
    </div>
</form>
<script>
    layui.use(['layer', 'form', 'upload'], function () {
        var layer = layui.layer,
            form = layui.form();
        layui.upload({
            url: '/up/image?token=<?=TOKEN?>&path=user_avatar'
            , elem: '#demo' //指定原始元素，默认直接查找class="layui-upload-file"
            , ext: 'jpeg|jpg|png'
            , method: 'post' //上传接口的http类型
            , success: function (rs) {
                document.querySelector('#avatar_view').src = rs.data.src;
                document.querySelector('#avatar').value = rs.data.path;
            }
        });
        form.on('submit(submit-btn)', function (data) {
            var loading = layer.load(0, {shade: <?=Yii::$app->params['layui_shade']?>, time: <?=Yii::$app->params['layui_time']?>});
            $.post(data.form.action, data.field, function (rs) {
                layer.msg(rs.msg);
                if (rs.code === 0) {
                    setTimeout(function () {
                        window.location.reload();
                    }, <?=Yii::$app->params['layui_set_timeout']?>);
                }
                layer.close(loading);
            }, 'json');
            return false;
        });
    });
</script>